/**
 * yu-code-editor
 * @created by qfkong 2020-01-07
 * @description 代码输入框
 */
(function (vue, $, name) {
  vue.component(name, {
    template: '<div class="convertImage">\
    <div class="title">\
        Json 工具\
    </div>\
    <div class="content">\
        <div id="editor">select * from user;</div>\
        <div class="btn-group button" role="group" aria-label="...">\
            <button type="button" class="btn btn-default" @click="jsonFormat">Json 格式化（format)</button>\
            <button type="button" class="btn btn-default" @click="jsonEncode">Json 压缩</button>\
        </div>\
    </div>\
</div>',
    data: function () {
      return {
      };
    },
    props: {
    },
    mounted:function() {
      var editor = ace.edit("editor");
      editor.setTheme("ace/theme/sqlserver");
      editor.session.setMode("ace/mode/sql");
      editor.setOptions({
        autoScrollEditorIntoView: true,
        copyWithEmptySelection: true,
      });
    },
    methods: {
      jsonEncode:function(){},
      jsonFormat:function(){}
    }
  });
}(Vue, yufp.$, 'yu-code-editor'));